<script setup>
import {Edit} from "@element-plus/icons";
import {defineProps} from "vue";

const props=defineProps(["empInfo"])
const emit=defineEmits(["showCreatePage",'edit'])


</script>


<template>
  <el-table
      :data="props['empInfo']"
      :highlight-current-row="true"
  >
    <el-table-column prop="id" label="编号" width="140"/>
    <el-table-column prop="name" label="名字" width="140"/>
    <el-table-column prop="status" label="状态" width="100">
      <template #default="scope">
        <el-tag
            :type="scope.row.status === '在职' ? 'success' : scope.row.status==='兼职'?'':scope.row.status==='试用'?'info':scope.row.status==='离职'?'danger':scope.row.status==='返聘'?'success':'warning'"
            disable-transitions
        >{{ scope.row.status }}</el-tag
        >
      </template>
    </el-table-column>
    <el-table-column prop="arriveDate" label="到岗日期" width="140"/>
    <el-table-column prop="position" label="工作岗位" width="140"/>
    <el-table-column prop="job" label="职务" width="140"/>
    <el-table-column prop="departmentId" label="部门编号" width="140"/>
    <el-table-column fixed="right"  width="120">
      <template #header>
        <el-button round type="success" size="mini" @click="emit('showCreatePage')">
          new
        </el-button>
      </template>
      <template #default="scope">
        <el-button
            :icon="Edit"
            circle
            size="mini"
            @click="emit('edit',scope.$index, scope.row)"
            :style="{marginLeft:'12px'}"
        >
        </el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<style scoped>



</style>